import React, { PureComponent } from 'react';
import _ from 'lodash';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Row, Col, Input, Modal, DatePicker, Select } from 'antd';
import { InputNumberC, InputC, SelectC, SingleDateC } from '../../../comps';
import moment from 'moment';
import { connect } from 'dva';
const FormItem = Form.Item;
const { Option } = Select;
@Form.create()
@connect(({ dataImportM }) => ({ dataImportM }))
export default class OTCOptionLifeCycleTable extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      confirmLoading: false,
    };
  }
  componentDidMount() {}

  UNSAFE_componentWillReceiveProps(nextProps) {}

  handleOk = () => {
    const {
      form: { validateFieldsAndScroll },
      dispatch,
      handCloseModal,
      data,
    } = this.props;

    validateFieldsAndScroll((error, values) => {
      this.setState({
        confirmLoading: true,
      });

      // 表单校验通过了
      const paramValues = values;

      if (paramValues.applyDate) {
        delete paramValues.applyDate;
      }
      if (paramValues.exchangeDate) {
        delete paramValues.exchangeDate;
      }
      paramValues.isAlter = '1';
      paramValues.id = data.id;
      //进行保存吧

      dispatch({
        type: 'dataImportM/updateTAdate',
        payload: {
          ...paramValues,
        },
        callback: (type) => {
          if (type == 'success') {
            handCloseModal('success');
            this.setState({
              confirmLoading: false,
            });
          }
        },
      });
    });
  };

  render() {
    const formItemLayout = {
      labelCol: {
        xs: { span: 7, offset: 0 },
        sm: { span: 12, offset: 0 },
        md: { span: 12, offset: 0 },
        lg: { span: 12, offset: 0 },
        xl: { span: 10, offset: 0 },
        xxl: { span: 8, offset: 0 },
      },
      wrapperCol: {
        xs: { span: 15, offset: 0 },
        sm: { span: 12, offset: 0 },
        md: { span: 12, offset: 0 },
        lg: { span: 12, offset: 0 },
        xl: { span: 12, offset: 0 },
        xxl: { span: 14, offset: 0 },
      },
    };

    const { form, visible, data, handCloseModal } = this.props;
    const { getFieldDecorator } = form;
    const selectData = [
      { value: '02', title: '申购' },
      { value: '03', title: '赎回' },
      { value: '50', title: '基金成立' },
      { value: '13', title: '基金转换出' },
      { value: '16', title: '基金转换入' },
      { value: '74', title: '现金分红' },
      { value: '73', title: '再投资1' },
      { value: '75', title: '再投资2' },
      { value: '70', title: '强增' },
      { value: '71', title: '强减' },
    ];

    return (
      <>
        <Modal
          title='修改TA数据'
          visible={visible}
          width={1053}
          onOk={this.handleOk}
          onCancel={() => handCloseModal()}
          confirmLoading={this.state.confirmLoading}
          destroyOnClose={true}
        >
          {data && (
            <Form>
              <Row>
                <Col span={6}>
                  <InputC
                    form={this.props.form}
                    dataIndex='fundCode'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    initialValue={data.fundCode ? data.fundCode : ''}
                    disabled
                    title='基金产品代码'
                  />
                </Col>
                <Col span={6}>
                  <InputC
                    form={this.props.form}
                    dataIndex='fundName'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    initialValue={data.fundName ? data.fundName : ''}
                    disabled
                    title='基金产品名称'
                  />
                </Col>
                <Col span={6}>
                  <SelectC
                    form={this.props.form}
                    disabled
                    initialValue={data.businessType ? data.businessType : ''}
                    dataIndex='businessType'
                    formItemLayout={formItemLayout}
                    dataSource={selectData}
                    title='业务类型'
                  />
                </Col>
                <Col span={6}>
                  <SingleDateC
                    form={this.props.form}
                    dataIndex='importDate'
                    title='交易申请日期'
                    formItemLayout={formItemLayout}
                    disabled
                    initialValue={data.exchangeDate ? moment(data.exchangeDate) : ''}
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='turnoverShare'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.turnoverShare}
                    precision={2}
                    title='成交份额'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='turnoverAmount'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.turnoverAmount}
                    precision={2}
                    title='成交金额'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='totalCost'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.totalCost}
                    precision={2}
                    title='总费用'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='transactionFee'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.transactionFee}
                    precision={2}
                    title='交易费'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='trusteeshipFee'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.trusteeshipFee}
                    precision={2}
                    title='托管费'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='stampDuty'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.stampDuty}
                    precision={2}
                    title='印花税'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='afterCharge'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.afterCharge}
                    precision={2}
                    title='后收费'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='otherExpenses'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.otherExpenses}
                    precision={2}
                    title='其他费用'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='gjjzcCost'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.gjjzcCost}
                    precision={2}
                    title='归基金资产费用'
                  />
                </Col>
                <Col span={6}>
                  <InputNumberC
                    form={this.props.form}
                    dataIndex='unitBonus'
                    formItemLayout={formItemLayout}
                    placeholder='请输入'
                    min={0}
                    initialValue={data.unitBonus}
                    precision={2}
                    title='单位分红'
                  />
                </Col>
              </Row>
            </Form>
          )}
        </Modal>
      </>
    );
  }
}
